import React from "react";
import "./hotMovie.scss";
import { useNavigate } from "react-router";

export default function Theatre(props: any) {
  let history = useNavigate();
  return (
    <div className="theatre-box">
      {props.list.map((item: any) => {
        return (
          <div
            className="theatre-item"
            onClick={() => {
              history("/movie/theatre/detail/" + item.id);
            }}
          >
            <div className="theatre-item-left">
              <div className="name">{item.name}</div>
              <div className="address">{item.address}</div>
              <div className="label-block">
                <span className="allowRefund">退</span>
                <span className="endorse">改签</span>
                <span className="snack">小吃</span>
              </div>
            </div>
            <div className="theatre-item-right">
              <div className="distance">{item.distance}</div>
            </div>
          </div>
        );
      })}
    </div>
  );
}
